Correct public performance metric contracts - #162
Open
mattcosta7 wants to merge 2 commits into
Open
Conversation
mattcosta7
marked this pull request as ready for review
August 3, 2026 16:34
mattcosta7
requested
a balanced review from Copilot
and removed request for
a team
August 3, 2026 16:34
Contributor
There was a problem hiding this comment.
🟡 Not ready to approve
DOM mutation normalization can report inaccurate per-second rates when sampling intervals are delayed or interrupted.
Once you've addressed the issues Copilot identified, you can request another Copilot review.
This review doesn't count toward merge requirements. Sign up for the private preview to control whether Copilot approvals count.
Pull request overview
Corrects public metric naming, units, metadata, UI terminology, documentation, and compatibility aliases.
Changes:
- Adds canonical metrics and exhaustive contract metadata.
- Normalizes DOM mutation reporting to mutations per second.
- Updates panel rendering, exports, tests, documentation, and release metadata.
File summaries
| File | Description |
|---|---|
.changeset/correct-metric-contracts.md |
Records the minor release. |
packages/storybook-addon-performance-panel/README.md |
Documents corrected contracts. |
packages/storybook-addon-performance-panel/react/performance-decorator.tsx |
Updates metric terminology. |
packages/storybook-addon-performance-panel/performance-panel.tsx |
Displays canonical metrics. |
packages/storybook-addon-performance-panel/index.ts |
Exports public contracts. |
packages/storybook-addon-performance-panel/index-universal.ts |
Exports universal contracts. |
packages/storybook-addon-performance-panel/core/performance-types.ts |
Defines metrics and metadata. |
packages/storybook-addon-performance-panel/collectors/style-mutation-collector.ts |
Names the sampling interval. |
packages/storybook-addon-performance-panel/collectors/README.md |
Documents collector semantics. |
packages/storybook-addon-performance-panel/collectors/paint-collector.ts |
Corrects collector terminology. |
packages/storybook-addon-performance-panel/collectors/input-collector.ts |
Clarifies double-RAF behavior. |
packages/storybook-addon-performance-panel/collectors/constants.ts |
Corrects constant descriptions. |
packages/storybook-addon-performance-panel/collectors/collector-manager.ts |
Produces canonical metrics and aliases. |
packages/storybook-addon-performance-panel/collectors/__tests__/performance-types.browser.test.ts |
Tests metadata and defaults. |
packages/storybook-addon-performance-panel/collectors/__tests__/paint-collector.browser.test.ts |
Updates collector test terminology. |
packages/storybook-addon-performance-panel/collectors/__tests__/collector-manager.browser.test.ts |
Tests canonical mappings. |
packages/storybook-addon-performance-panel/__tests__/performance-panel.browser.test.tsx |
Tests updated panel labels. |
Review details
- Files reviewed: 17/17 changed files
- Comments generated: 4
- Review effort level: Balanced
We're testing this review assessment. Please use 👍 or 👎 to tell us if it's correct.
| const scriptResourceLoadTime = Math.round(paint.scriptEvalTime * 10) / 10 | ||
| const averageDomMutationsPerSample = computeAverage(style.domMutationFrames) | ||
| const domMutationsPerSample = Math.round(averageDomMutationsPerSample) | ||
| const domMutationsPerSecond = Math.round((averageDomMutationsPerSample * 1000) / DOM_MUTATION_SAMPLE_INTERVAL_MS) |
Comment on lines
+90
to
+93
| await expect.poll(() => document.body.textContent).toContain('Pointer Frame Interval') | ||
| await expect.poll(() => document.body.textContent).toContain('DOM Churn') | ||
| await expect.poll(() => document.body.textContent).toContain('Initial Paint Milestones') | ||
| await expect.poll(() => document.body.textContent).toContain('Layer-Promotion Candidates') |
| /** Layer-promotion candidates above this needs attention */ | ||
| LAYERS_WARNING: 20, | ||
| /** Compositor layers above this is concerning */ | ||
| /** Layer-promotion candidates above this is concerning */ |
| /** CSS var changes above this is excessive */ | ||
| CSS_VAR_CHANGES_WARNING: 50, | ||
| /** Compositor layers above this needs attention */ | ||
| /** Layer-promotion candidates above this needs attention */ |
Co-authored-by: mattcosta7 <8616962+mattcosta7@users.noreply.github.com>
Contributor
There was a problem hiding this comment.
Review details
Suppressed comments (2)
packages/storybook-addon-performance-panel/core/performance-types.ts:639
- This alias is populated from script resource loading duration, not script evaluation time, so marking it
highconfidence contradicts the metadata contract's definition of fidelity to the metric's public name. The legacy evaluation metric is unavailable; its metadata should communicate that rather than endorsing the mismatched value.
scriptEvalTime: {provenance: 'derived', quality: 'high', unit: 'milliseconds'},
packages/storybook-addon-performance-panel/collectors/style-mutation-collector.ts:110
- Resetting while collection is active sets the sampling epoch to zero without restarting the interval. The next sample therefore uses the entire
performance.now()time origin as its duration, which can suppressdomMutationsPerSeconduntil that sample rolls out of the 30-entry window. Rebase the epoch at reset so the next sample only covers post-reset time.
this.#lastDomMutationSampleTime = 0
- Files reviewed: 18/18 changed files
- Comments generated: 1
- Review effort level: Balanced
| pointerFrameInterval, | ||
| maxPointerFrameInterval, | ||
| pointerFrameJitter: input.paintJitter, | ||
| initialPaintMilestones: paint.paintCount, |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This PR is stacked on #161 (
v1.3/01-overhead-baseline) so the benchmark foundation remains part of the combined 1.2.0 release work.Validation
npm run tscnpm run lint(no errors; one unrelated existing warning)npm run build(attwandpublintpassed)